require("../css/drill.less")
require("../fonts/iconfont.css")

//声明一个公共的服务器地址
const BASE_URL = 'http://139.9.177.51:8099'

document.ready(function () {
    let suspend = document.querySelector("#suspend")
    let quit = document.querySelector(".quit")
    let continueBtn = document.querySelector(".continue")
    let videoBox = document.querySelector("#videos")
    let prev = document.querySelector("#prev")
    let next = document.querySelector("#next")
    let curIndex = document.querySelector("#cur_index")
    let countIndex = document.querySelector("#count_index")
    let curItme = document.querySelector("#cur_itme")
    let endBtn = document.querySelector(".end")

    //显示蒙尘
    suspend.addEventListener("click", function () {
        quit.style = 'visibility: visible'
        videoBox.pause();
        clearInterval(timer)
    })
    //隐藏蒙尘
    continueBtn.addEventListener("click", function () {
        quit.style = 'visibility: hidden'
        videoBox.play()
        calcBar()
    })

    //点击结束训练
    let userId = JSON.parse(window.localStorage.getItem('user')).userId
    let id = window.localStorage.getItem('id')
    console.log(id);
    endBtn.addEventListener("click", function () {
        quit.style = 'visibility: hidden'
        let tatoalTime = 0
        pracArr.forEach(item => tatoalTime += item)
        window.$http.post('/sports/saveTrain', {
            id:id,
            userId:userId,
            takeTime:tatoalTime,
            calorie:tatoalTime * 1.3
        }, function (res) {
            if (res.status === 0) {
                window.$utils.toast(res.status, "上传成功")
                setTimeout(function(){
                location.href = './exercise.html'
                },1500)
            }
        })
    })

    // 上一节
    prev.addEventListener("click", function () {
        index--
        if (index < 0) {
            index = 0
            return
        }
        palyVideo(index);
    })

    // 下一节
    next.addEventListener("click", function () {
        index++
        if (index >= data.length) {
            index = data.length - 1
            return
        }
        palyVideo(index);
    })

    let data = JSON.parse(window.localStorage.getItem('video'))
    let index = 0;
    palyVideo(index);
    console.log(data);
    function palyVideo(i) {
        setTimeout(function () {
            videoBox.src = BASE_URL + data[i].videoUrl
            // videoBox.play()
            curIndex.textContent = i + 1
            countIndex.textContent = data.length
            curItme.textContent = data[i].title
            calcBar()
        }, 100)
    }

    videoBox.addEventListener("ended", function () {
        // index++
        // if (index >= data.length) return
        // palyVideo(index);
        next.click();
    })

    let timer = null
    let progress = document.querySelector("#progress")
    calcBar()
    let pracArr = []
    function calcBar() {
        timer = setInterval(function () {
            pracArr[index] = videoBox.currentTime
            let percent = videoBox.currentTime / videoBox.duration * 100
            progress.style.width = percent + '%'
        }, 50)
    }
})